Update the Browse Page on CLARK Client#2154
Update the Browse Page on CLARK Client#2154Cwagne17 wants to merge 12 commits intochore/sc-36142/upgrade-angular-from-17-to-18-on-clark-clientfrom
Conversation
| const frameworks = await this.guidelineService.getFrameworks({ limit: 100, page: 1 }); | ||
| this.frameworkFilter = { | ||
| section: 'Guidelines', | ||
| section: 'Frameworks', |
| <br /> | ||
| <p> | ||
| FILTER BY TAG | ||
| <a href="https://forms.gle/j8jp5Qqvm3yxwPei8" target="_blank" class="beta" |
There was a problem hiding this comment.
This has been here for a little bit too and I have no idea what responses we've got, good time to let it go
| <clark-skip-link title="Skip Directly to Learning Objects" skipLocation="results"></clark-skip-link> | ||
| <div *ngIf="filters" class="sidebar-wrapper" [ngClass]="{'active': filtersDownMobile}"> | ||
| <div class="column-title"> | ||
| <clark-skip-link title="Skip Directly to Learning Objects" skipLocation="results"></clark-skip-link> |
There was a problem hiding this comment.
Not sure I remember this being here or its purpose
| checkDCWFAlignment() { | ||
| if (this.learningObject?.guidelines && this.learningObject.guidelines.length > 0) { | ||
| this.isDCWFAligned = this.learningObject.guidelines.some(guideline => | ||
| guideline.source && |
There was a problem hiding this comment.
Looks like from the screenshot and the demo you gave us it seemed to work good, wonder if its better to change guideilne.source to guideline.author since author exists on both Frameworks and Search-Index collections. I only see the source attribute in Frameworks and I imagined we'd either be pulling from Guidelines or Search-Index. It should be using Search-Index since that's what has frameworkName
Like I said though guess if it works it works,
| const firstTag = this.learningObject.tags[0]; | ||
|
|
||
| // Check if tags are already objects with a name property | ||
| if (firstTag && typeof firstTag === 'object') { |
There was a problem hiding this comment.
I wonder if this tag being a type object would ever pass here, on objects-index tags are a string array of the tag ids, I don't see earlier in this file where learningObject.tags could've been changed to be something different. Could have missed it I guess, but can't tell if this code resolves them correctly cause I know with where the design left off it doesn't display tags on the learning object cards does it
dsoto18
left a comment
dsoto18
left a comment
There was a problem hiding this comment.
just a couple comments but looks good to me
3 participants
This pull request significantly refactors the browse page UI and logic to provide a more modern, intuitive filtering and sorting experience for users. The changes introduce a sticky filter bar with dropdowns for key filter types, a full-screen modal for filters on mobile, and an updated results grid layout. The filter and sort logic in the component has been reworked for clarity and maintainability, with improved synchronization between UI state and the underlying query object.
UI/UX Improvements:
browse.component.html)Filter and Sort Logic Refactor:
browse.component.ts) [1] [2] [3]browse.component.ts) [1] [2]Query and Pagination Updates:
browse.component.ts) [1] [2]Filter Reset and Synchronization:
browse.component.ts)These changes collectively modernize the browse experience, streamline filter and sort interactions, and improve maintainability of the codebase.